<template>
	<view class="item">
		<view class="headerView spaceBetween">
			<view class="orderNumber">
				<text v-show="data.order_sn && data.order_sn != ''">订单号：{{ data.order_sn }}</text>
			</view>
			<view class="state">{{ data.t_tstatus == 0 ? '待使用' : '已使用' }}</view>
		</view>
		<view class="exhibitionCard flex" @click="det(data)" :class="noboder ? 'noboder' : ''">
			<divimg class="banner" :src="data.image" mode="aspectFill"></divimg>
			<view class="box">
				<view class="title">{{ data.name }}</view>
				<view class="subtitle">
					{{ data.spec_value_str }}
				</view>
				<view class="line">
					<image class="icon" src="/static/images/wbz/date.png" mode="heightFix"></image>
					<view class="txt">{{ timeStrGetDate(data.start_time) + '~' + timeStrGetDate(data.end_time) }}</view>
				</view>
				<view class="line">
					<image class="icon" src="/static/images/wbz/time.png" mode="heightFix"></image>
					<view class="txt">{{ timeStrGetTime(data.start_time) + '~' + timeStrGetTime(data.end_time) }}</view>
				</view>
				<view class="line">
					<image class="icon" src="/static/images/wbz/map.png" mode="heightFix"></image>
					<view class="txt">{{ data.address }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { timeStrGetDate, timeStrGetTime } from '@/utils/utils.js';
	import { boolean } from 'mathjs';
	export default {
		props: {
			data: {
				type: Object,
				default: () => {},
			},
			noboder: {
				type: Boolean,
				default: false,
			},
			detClick: {
				type: Boolean,
				default: false,
			},
		},
		methods: {
			timeStrGetDate: timeStrGetDate,
			timeStrGetTime: timeStrGetTime,
			det({ id, type, oid }) {
				if (!this.detClick) {
					
					return;
				}
				uni.navigateTo({
					url: '/pages/my/admissionTicket/details/details?id=' + id +'&oid='+oid,
				});
				// uni.navigateTo({
				// 	url: '/pages/wbz/details/details?id=' + id + '&type=' + type + '&ticket=true&oid=' + oid,
				// });
			},
		},
	};
</script>

<style lang="scss" scoped>
	.item {
		overflow: hidden;
		.headerView {
			width: 100%;
			overflow: hidden;
			line-height: 64rpx;
			border-bottom: 1rpx solid #dddddd;
			font-size: $uni-font-size-12;
			.orderNumber {
				color: #999999;
				margin-left: $submargin-width;
			}
			.state {
				color: #000000;
				margin-right: $submargin-width;
			}
		}
		.exhibitionCard {
			width: 630rpx;
			// height: 250rpx;
			border-radius: 20rpx;
			background: #ffffff;
			margin: 0 auto;
			align-items: center;
			border-bottom: 1rpx solid #dddddd;
			padding-bottom: $submargin-width;
			.banner {
				width: 160rpx;
				height: 160rpx;
				background: #cfcfcf;
				border-radius: 20rpx;
			}
			.box {
				width: 370rpx;
				overflow: hidden;
				.title {
					margin: $margin-width;
					margin-bottom: 15rpx;
					color: #000000;
					font-size: $uni-font-size-13;
				}
				.subtitle {
					color: $price-color;
					font-size: $uni-font-size-12;
					margin: $submargin-width $margin-width;
				}
				.line {
					margin-top: 15rpx;
					margin-left: 30rpx;
					align-items: center;
					display: flex;
					.icon {
						height: 25rpx;
						min-height: 25rpx;
						min-width: 20rpx;
						margin-right: 15rpx;
					}
					.txt {
						color: #666666;
						font-size: $uni-font-size-12;
					}
					.unit {
						font-size: $uni-font-size-12;
						color: #1fc28b;
					}
				}
			}
		}
		.noboder {
			border: none;
		}
	}
</style>
